---
title: gluestack-ui Actionsheet Component | Installation, Usage, and API

description: The Actionsheet component presents a set of options to the user, overlaid on top of the app's content, allowing them to take quick actions without leaving the current page or view.

pageTitle: Actionsheet

pageDescription: The Actionsheet component presents a set of options to the user, overlaid on top of the app's content, allowing them to take quick actions without leaving the current page or view.

showHeader: true

tag: beta
---

import { Meta } from '@storybook/addon-docs';

<Meta title="with-gluestack-style/Components/Disclosure/Actionsheet" />

import {
  Actionsheet,
  ActionsheetBackdrop,
  ActionsheetContent,
  ActionsheetDragIndicator,
  ActionsheetDragIndicatorWrapper,
  ActionsheetItem,
  ActionsheetItemText,
  ActionsheetIcon,
  ActionsheetScrollView,
  ActionsheetVirtualizedList,
  ActionsheetFlatList,
  ActionsheetSectionList,
  ActionsheetSectionHeaderText,
  Button,
  ButtonText,
  Box,
  VStack,
  Input,
  InputIcon,
  InputSlot,
  InputField,
  FormControl,
  FormControlLabel,
  FormControlLabelText,
  FormControlHelper,
  FormControlHelperText,
  HStack,
  Image,
  Text,
  PlayIcon,
  FavouriteIcon,
  CloseIcon,
  Icon,
  TrashIcon,
  ShareIcon
} from '../../core-components/themed';
import {
  KeyboardAvoidingView,
} from '@gluestack-ui/themed';
import { CreditCardIcon } from 'lucide-react-native';
import { transformedCode } from '../../utils';
import {
  AppProvider,
  CodePreview,
  Table,
  TableContainer,
  InlineCode,
  AddIcon,
  InfoIcon,
  Alert,
  Tabs,
} from '@gluestack/design-system';
import { config } from '@gluestack-ui/config';
import Wrapper from '../../core-components/themed/Wrapper';
import { CollapsibleCode } from '@gluestack/design-system';
import { Platform } from 'react-native';

### Actionsheet

Coming soon!